<script setup>
import dayjs from 'dayjs';
import { Message, MessageBox } from 'element-ui';
import { cloneDeep, forEach, some, map } from 'lodash-es';
import {
  getBasisList,
  getTreeData,
  addBasisList,
  getBasisHistoryList,
  editBasis,
  getEnBasisHistory,
  deleteEnBasisVo,
} from '@/api/index.js';
import { useRequest, useWatch, useDownload } from '@/hooks';
import { useGlobalState } from '@/store/globalState.js';
import DataImport from '@/components/DataImport/index.vue';
import HistoryBasis from './HistoryBasis.vue';

const props = defineProps({
  enterprise: { type: Object, default: () => null },
  projectCode: { type: String, default: () => null },
});
const uploadUrl = ref(useGlobalState().globalState.serverUrl + '/energyservice/basis/importData');
const defaultProps = {
  // 默认设置
  children: 'children',
  label: 'name',
};
const treeRef = ref(null);
const treeRef2 = ref(null);
const submitForm = ref({
  newBasisTime: null,
  remark: null,
  area: [],
});
const jzbgVisible = ref(false);
const lsjzVisible = ref(false);
const lsxgjlVisible = ref(false);
const dialogForm = ref({
  newBasisTime: null,
  remark: null,
  area: [],
});
const tableTable = ref([]);
const dialogTable = ref([]);
const pageObj = ref({
  pageSize: 2,
  pageNum: 1,
});
const pageObj2 = ref({
  pageSize: 2,
  pageNum: 1,
});
const xgjlCode = ref('');
const [buildData, loading2, buildRun] = useRequest(getTreeData, {
  manual: true,
});
const [, loading, run] = useRequest(getBasisList, {
  manual: true,
  onSuccess: res => {
    if (res.code === 200) {
      if (res?.data?.length > 0) {
        const obj = cloneDeep(res?.data);
        submitForm.value.newBasisTime = obj?.[0]?.year;
        submitForm.value.area = obj?.[0]?.area;
        submitForm.value.remark = obj?.[0]?.remark;
        dialogForm.value.newBasisTime = obj?.[0]?.year;
        dialogForm.value.area = obj?.[0]?.area;
        dialogForm.value.remark = obj?.[0]?.remark;
        tableTable.value = cloneDeep(res?.data);
        dialogTable.value = cloneDeep(res?.data);
      } else {
        MessageBox.confirm('基准信息不可编辑，请到“托管配置”模块设置托管年限、托管能源类型、托管类型等信息…', '提示', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        }).then(() => {});
      }
    }
  },
  onError: err => {
    submitForm.value = {
      newBasisTime: null,
      remark: null,
      area: [],
    };
    dialogForm.value = {
      newBasisTime: null,
      remark: null,
      area: [],
    };
    tableTable.value = [];
    dialogTable.value = [];
  },
});
const [, , addRun] = useRequest(addBasisList, {
  manual: true,
  onSuccess: res => {
    if (res.code === 200) {
      Message.success(res.msg);
      jzbgVisible.value = false;
      setTimeout(() => {
        treeRef.value.setCheckedKeys([]);
        run({ enterpriseCode: props.enterprise?.enterpriseCode, projectCode: props.projectCode, projectType: 'TG' });
      }, 10);
    }
  },
});
const [, , editRun] = useRequest(editBasis, {
  manual: true,
  onSuccess: res => {
    if (res.code === 200) {
      Message.success(res.msg);
      setTimeout(() => {
        treeRef.value.setCheckedKeys([]);
        run({ enterpriseCode: props.enterprise?.enterpriseCode, projectCode: props.projectCode, projectType: 'TG' });
      }, 10);
    }
  },
});
const [history, loading3, hisRun] = useRequest(getBasisHistoryList, {
  manual: true,
});
const [, , deleteRun] = useRequest(deleteEnBasisVo, {
  manual: true,
  onSuccess: res => {
    if (res.msg === '操作成功') {
      Message.success(res.msg);
      pageObj.value = {
        pageSize: 2,
        pageNum: 1,
      };
      hisRun({
        enterpriseCode: props?.enterprise?.enterpriseCode,
        projectCode: props?.projectCode,
        isGetHistory: 'yes',
        projectType: 'TG',
        ...pageObj.value,
      });
    }
  },
});

const [recordData, loading4, recordRun] = useRequest(getEnBasisHistory, {
  manual: true,
});

const handleUpload = (data, type) => {
  if (type === 1) {
    tableTable.value = data ?? [];
  } else {
    dialogTable.value = data ?? [];
  }
};
const handleDownload = () => {
  useDownload('/energyservice/basis/templateDownload', {}, '基准模板.xlsx');
};
const downloadData = id => {
  useDownload(
    '/energyservice/basis/basisExcelImport',
    { enterpriseCode: props?.enterprise?.enterpriseCode, projectType: 'TG', projectCode: id },
    '基准数据.xlsx',
  );
};
const downloadData2 = (pId, bId) => {
  useDownload(
    '/energyservice/basis/basisHistoryExcelImport',
    {
      enterpriseCode: props?.enterprise?.enterpriseCode,
      projectType: 'TG',
      projectCode: pId,
      isGetHistory: 'yes',
      basisCode: bId,
    },
    '历史基准数据.xlsx',
  );
};
const pickerOptions = computed(() => {
  return {
    disabledDate: time => {
      if (tableTable.value?.[0]?.priorYear?.length > 0) {
        return (
          dayjs(time) < dayjs(tableTable.value?.[0]?.priorYear) ||
          dayjs(time) > dayjs(tableTable.value?.[tableTable.value.length - 1]?.endTime)
        );
      } else {
        return (
          dayjs(time) < dayjs(tableTable.value?.[0]?.year) ||
          dayjs(time) > dayjs(tableTable.value?.[tableTable.value.length - 1]?.endTime)
        );
      }
    },
  };
});
const pickerOptions2 = computed(() => {
  return {
    disabledDate: time => {
      if (dialogTable.value?.[0]?.priorYear?.length > 0) {
        return (
          dayjs(time) < dayjs(dialogTable.value?.[0]?.priorYear) ||
          dayjs(time) > dayjs(dialogTable.value?.[dialogTable.value.length - 1]?.endTime)
        );
      } else {
        return (
          dayjs(time) < dayjs(dialogTable.value?.[0]?.year) ||
          dayjs(time) > dayjs(dialogTable.value?.[dialogTable.value.length - 1]?.endTime)
        );
      }
    },
  };
});

const jzbgButton = () => {
  jzbgVisible.value = true;
};
const jzbgCancel = () => {
  jzbgVisible.value = false;
  run({ enterpriseCode: props.enterprise?.enterpriseCode, projectCode: props.projectCode, projectType: 'TG' });
};
const currentChecked = (nodeObj, SelectedObj, type) => {
  if (type === 1) {
    let thisNode = treeRef.value.getNode(nodeObj?.id);
    let keys = treeRef.value.getCheckedKeys();
    if (thisNode.checked) {
      for (let i = thisNode.level; i > 1; i--) {
        treeRef.value.setChecked(thisNode.parent, false);
        if (!thisNode.parent.checked) {
          thisNode = thisNode.parent;
          keys.push(thisNode.data.id);
        }
      }
    }
    treeRef.value.setCheckedKeys(keys);
    submitForm.value.area = SelectedObj.checkedKeys;
  } else {
    let thisNode2 = treeRef2.value.getNode(nodeObj?.id);
    let keys2 = treeRef2.value.getCheckedKeys();
    if (thisNode2.checked) {
      for (let i = thisNode2.level; i > 1; i--) {
        treeRef2.value.setChecked(thisNode2.parent, false);
        if (!thisNode2.parent.checked) {
          thisNode2 = thisNode2.parent;
          keys2.push(thisNode2.data.id);
        }
      }
    }
    treeRef2.value.setCheckedKeys(keys2);
    dialogForm.value.area = SelectedObj.checkedKeys;
  }
};

const handleCheckChange = (data, check, indeterminate) => {};
const handleSumbit = () => {
  let SUBMIT = false;
  some(tableTable.value, item => {
    some(item.basiss, n => {
      for (let key in n) {
        if (key === 'basisQuantity' || key === 'basisCost') {
          if (!n[key] || n[key] === 0 || n[key]?.length === 0) {
            SUBMIT = true;
            return true;
          } else {
          }
        }
      }
    });
  });
  if (SUBMIT) {
    Message.error('基准能源能耗参数为必填');
  } else {
    if (submitForm.value?.newBasisTime?.length > 0) {
      let keys = treeRef.value.getCheckedKeys();
      if (keys?.length > 0) {
        let index = -1;
        let obj = forEach(cloneDeep(tableTable.value), (n, i) => {
          if (Number(submitForm.value.newBasisTime.slice(0, 4)) > Number(n.year.slice(0, 4))) {
            index = i > index ? i : index;
          } else if (Number(submitForm.value.newBasisTime.slice(0, 4)) == Number(n.year.slice(0, 4))) {
            n.year = submitForm.value.newBasisTime;
          }
          n.remark = submitForm.value.remark;
          forEach(n.basiss, el => {
            if (el.isNewBasis == 1 || el.isNewBasis == 0) {
              if (el.startTime == submitForm.value.newBasisTime) {
              } else {
                el.isNewBasis = 1;
              }
            } else {
              el.isNewBasis = 0;
            }
            el.buildingCode = keys.toString();
            el.enterpriseCode = props.enterprise?.enterpriseCode;
            el.startTime = n.year;
            el.endTime = n.endTime;
          });
        });
        if (index > -1) {
          obj.splice(0, index + 1);
        }
        MessageBox.confirm('请确认信息无误，提交后，历史基准数据不可修改', '提示', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            if (!tableTable.value[0]?.basiss[0]?.isNewBasis) {
              addRun(obj);
            } else {
              // if (submitForm.value.newBasisTime == tableTable.value[0]?.year) {
              editRun(obj);
              // } else {
              //   addRun(obj);
              // }
            }
          })
          .catch(() => {});
      } else {
        Message.error('关联区域为必填');
      }
    } else {
      Message.error('开始时间/变更时间为必填');
    }
  }
};
const dialogSubmit = () => {
  let SUBMIT = false;
  some(dialogTable.value, item => {
    some(item.basiss, n => {
      for (let key in n) {
        if (key === 'basisQuantity' || key === 'basisCost') {
          if (!n[key] || n[key] === 0 || n[key].length === 0) {
            SUBMIT = true;
            return true;
          } else {
            SUBMIT = false;
          }
        }
      }
    });
  });
  if (SUBMIT) {
    Message.error('基准能源能耗参数为必填');
  } else {
    if (dialogForm.value?.newBasisTime?.length > 0) {
      if (dialogForm.value?.area?.length > 0) {
        let index = -1;
        let obj = forEach(cloneDeep(dialogTable.value), n => {
          if (Number(dialogForm.value.newBasisTime.slice(0, 4)) > Number(n.year.slice(0, 4))) {
            index = i > index ? i : index;
          } else if (Number(dialogForm.value.newBasisTime.slice(0, 4)) == Number(n.year.slice(0, 4))) {
            n.year = dialogForm.value.newBasisTime;
          }
          n.remark = dialogForm.value.remark;
          forEach(n.basiss, el => {
            el.isNewBasis = 1;
            el.buildingCode = dialogForm.value.area.toString();
            el.enterpriseCode = props.enterprise?.enterpriseCode;
            el.startTime = n.year;
            el.endTime = n.endTime;
          });
        });
        if (index > -1) {
          obj.splice(0, index + 1);
        }
        MessageBox.confirm('请确认信息无误，提交后，历史基准数据不可修改', '提示', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            addRun(obj);
          })
          .catch(() => {});
      } else {
        Message.error('关联区域为必填');
      }
    } else {
      Message.error('变更时间为必填');
    }
  }
};
const lsjzButton = () => {
  lsjzVisible.value = true;
  hisRun({
    enterpriseCode: props?.enterprise?.enterpriseCode,
    projectCode: props?.projectCode,
    isGetHistory: 'yes',
    projectType: 'TG',
    ...pageObj.value,
  });
};
const lsjzCancel = () => {
  lsjzVisible.value = false;
  pageObj.value = {
    pageSize: 2,
    pageNum: 1,
  };
  history.value = [];
};
const lsjzDelete = id => {
  MessageBox.confirm('删除文件，修改记录同步删除，不可找回，是否确认删除', '提示', {
    confirmButtonText: '是',
    cancelButtonText: '否',
    type: 'warning',
  })
    .then(() => {
      if (id) deleteRun({ basisCode: id });
    })
    .catch(() => {});
};
const showXgjl = id => {
  lsxgjlVisible.value = true;
  xgjlCode.value = id;
  recordRun({ basisCode: id, ...pageObj2.value, enterpriseCode: props.enterprise?.enterpriseCode });
};
const getList = e => {
  pageObj.value.pageNum = e.page;
  pageObj.value.pageSize = e.limit;
  hisRun({
    enterpriseCode: props?.enterprise?.enterpriseCode,
    projectCode: props?.projectCode,
    isGetHistory: 'yes',
    projectType: 'TG',
    ...pageObj.value,
  });
};
const getList2 = e => {
  pageObj2.value.pageNum = e.page;
  pageObj2.value.pageSize = e.limit;
  recordRun({ basisCode: xgjlCode.value, enterpriseCode: props.enterprise?.enterpriseCode, ...pageObj2.value });
};

useWatch(
  () => [props.enterprise, props.projectCode],
  ([n, n1]) => {
    if (n && n1) {
      run({ enterpriseCode: n?.enterpriseCode, projectCode: props.projectCode, projectType: 'TG' });
      buildRun({ enterpriseCode: n.enterpriseCode });
    } else if (n && !n1) {
      MessageBox.confirm('基准信息不可编辑，请到“托管配置”模块设置托管年限、托管能源类型、托管类型等信息…', {
        confirmButtonText: '确定',
        // cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {});
    }
  },
  { deep: true, immediate: true },
);
</script>
<template>
  <div class="u-h100">
    <div class="u-p20 u-df-spb">
      <div class="title-top u-df-st">
        <span v-show="!tableTable?.[0]?.basiss?.[0]?.isNewBasis || tableTable?.[0]?.basiss?.[0]?.isNewBasis == 0">
          托管开始时间：
          <span class="u-primary">{{ tableTable?.[0]?.year ?? '-' }}</span>
        </span>
        <div v-show="tableTable?.[0]?.basiss?.[0]?.isNewBasis == 1">
          <span class="red">*</span>
          变更时间：
          <el-date-picker
            size="small"
            popper-class="picker-dateNoneYear"
            v-model="submitForm.newBasisTime"
            placeholder="请选择"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            suffix-icon="el-icon-date"
            class="el-date-editor"
            style="width: 150px"
            :clearable="false"
            :picker-options="pickerOptions"
          />
          <span class="red">
            <!-- 托管开始时间/ -->
            *上次变更时间:
            <span class="u-primary">{{ tableTable?.[0]?.priorYear ?? '-' }}</span>
            托管结束时间:
            <span class="u-primary">{{ tableTable?.[tableTable.length - 1]?.endTime ?? '-' }}</span>
          </span>
        </div>
      </div>
      <div class="u-df-st">
        <DataImport
          :onlyShowBtn="true"
          :showIcon="false"
          :showTemDownload="false"
          impText="导入数据"
          :showResolve="false"
          title="数据"
          :uploadUrl="uploadUrl"
          class="u-ml10 u-mr10"
          :extraParams="{ enterpriseCode: enterprise?.enterpriseCode, projectCode: projectCode }"
          @handleFileSuccess="handleUpload($event, 1)"
        />
        <el-button class="u-ml5" size="small" type="primary" @click="handleDownload" plain>下载模板</el-button>
        <el-button size="small" type="primary" @click="downloadData(tableTable?.[0]?.basiss?.[0]?.projectCode)" plain>
          下载数据
        </el-button>
        <el-popover placement="top" trigger="hover" content="基准变更，历史基准数据将不可修改哦！" popper-class="pop">
          <el-button
            class="popButton"
            slot="reference"
            size="small"
            type="primary"
            @click="jzbgButton"
            plain
            :disabled="tableTable[0]?.basiss?.[0]?.basisQuantity < 1"
          >
            基准变更
          </el-button>
        </el-popover>
        <el-button size="small" type="primary" @click="lsjzButton" plain>历史基准</el-button>
      </div>
    </div>
    <div class="ad-wrapper">
      <div class="khzb-left">
        <el-table v-loading="loading" :data="tableTable" height="100%" border>
          <el-table-column label="托管年份" align="center" min-width="120">
            <template slot-scope="scope">
              {{ scope.row?.year?.slice(0, 4) }}
            </template>
          </el-table-column>
          <!-- <el-table-column label="基准类型" align="center" prop="basisTypeName">
            <template slot-scope="scope">
              {{ scope.row?.year }}
            </template>
          </el-table-column> -->
          <el-table-column
            v-for="(item, index) in tableTable[0]?.basiss ?? []"
            :key="index"
            :label="item.basisTypeName"
            align="center"
          >
            <el-table-column :label="'基准能耗（' + item.basisTypeUnit + '）'" min-width="160" align="center">
              <template slot-scope="scope">
                <el-input-number
                  v-filter-input
                  v-model="tableTable[scope.$index].basiss[index].basisQuantity"
                  clearable
                  size="small"
                  :precision="2"
                  :controls="false"
                ></el-input-number>
                <!-- <span>{{ scope.$index }}</span> -->
              </template>
            </el-table-column>
            <el-table-column label="基准费用（元）" min-width="160" align="center">
              <template slot-scope="scope">
                <el-input-number
                  v-filter-input
                  v-model="tableTable[scope.$index].basiss[index].basisCost"
                  clearable
                  size="small"
                  :precision="2"
                  :controls="false"
                ></el-input-number>
              </template>
            </el-table-column>
          </el-table-column>
        </el-table>
      </div>
      <div class="khzb-right">
        <div class="title-top u-df-st">
          <span class="red">*</span>
          关联区域
        </div>
        <el-tree
          ref="treeRef"
          v-loading="loading2"
          :data="buildData ?? []"
          :props="defaultProps"
          :highlight-current="true"
          show-checkbox
          :check-strictly="true"
          :default-checked-keys="submitForm?.area ?? []"
          @check="(nodeObj, SelectedObj) => currentChecked(nodeObj, SelectedObj, 1)"
          @check-change="handleCheckChange"
          node-key="id"
          class="u-p20 mtree"
          default-expand-all
        >
          <span class="custom-tree-node u-fs14" slot-scope="{ node, data }">
            <!-- <ToolTip class="tree-lable u-pr20" :content="data.name" effect="dark" /> -->
            <span class="tree-lable u-pr20">{{ data.name }}</span>
          </span>
        </el-tree>
      </div>
    </div>
    <div class="u-ml20 u-mr20">
      <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="submitForm.remark"></el-input>
    </div>
    <div class="u-p20 u-df-spb">
      <div>
        <span class="u-pr20">操作人：{{ tableTable?.[0]?.createPerson ?? '-' }}</span>
        <span>操作时间：{{ tableTable?.[0]?.createTime ?? '-' }}</span>
      </div>
      <el-button size="small" type="primary" @click="handleSumbit">提交</el-button>
    </div>
    <el-dialog :visible.sync="jzbgVisible" :append-to-body="true" :before-close="jzbgCancel" width="90%">
      <div slot="title" class="dialog-title">
        <span class="tit u-prim-text">
          <span class="u-prim-text">基准变更</span>
          <span class="red u-fs14">*基准变更，历史基准数据将不可修改哦！</span>
        </span>
      </div>
      <div class="u-p20 u-df-spb u-prim-text">
        <div class="title-top u-df-st">
          <!-- <span v-show="!dialogTable?.[0]?.basiss?.[0]?.isNewBasis || dialogTable?.[0]?.basiss?.[0]?.isNewBasis == 0">
            托管开始时间：
            <span class="u-primary">{{ submitForm?.newBasisTime ?? '-' }}</span>
          </span> -->
          <div>
            <span class="red">*</span>
            变更时间：
            <el-date-picker
              size="small"
              popper-class="picker-dateNoneYear"
              v-model="dialogForm.newBasisTime"
              placeholder="请选择"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              suffix-icon="el-icon-date"
              class="el-date-editor"
              style="width: 150px"
              :clearable="false"
              :picker-options="pickerOptions2"
            />
            <span class="red">
              <!-- *托管开始时间/ -->
              上次变更时间:
              <span class="u-primary">
                {{ dialogTable?.[0]?.priorYear?.length > 0 ? dialogTable[0].priorYear : '-' }}
              </span>
              托管结束时间:
              <span class="u-primary">{{ dialogTable?.[dialogTable.length - 1]?.endTime ?? '-' }}</span>
            </span>
          </div>
        </div>
        <div class="u-df-st">
          <DataImport
            :onlyShowBtn="true"
            :showIcon="false"
            :showTemDownload="false"
            impText="导入数据"
            :showResolve="false"
            title="数据"
            :uploadUrl="uploadUrl"
            class="u-ml10 u-mr10"
            :extraParams="{ enterpriseCode: enterprise?.enterpriseCode }"
            @handleFileSuccess="handleUpload($event, 2)"
          />
          <el-button class="u-ml5" size="small" type="primary" @click="handleDownload" plain>下载模板</el-button>
          <el-button size="small" type="primary" @click="downloadData(dialogTable[0]?.basiss?.[0]?.projectCode)" plain>
            下载数据
          </el-button>
        </div>
      </div>
      <div class="ad-wrapper u-prim-text">
        <div class="khzb-left" style="height: 350px">
          <el-table v-loading="loading" :data="dialogTable" height="100%" border>
            <el-table-column label="托管年份" align="center" min-width="120">
              <template slot-scope="scope">
                {{ scope.row?.year?.slice(0, 4) }}
              </template>
            </el-table-column>
            <el-table-column
              v-for="(item, index) in dialogTable[0]?.basiss ?? []"
              :key="index"
              :label="item.basisTypeName"
              align="center"
            >
              <el-table-column :label="'基准能耗（' + item.basisTypeUnit + '）'" min-width="160" align="center">
                <template slot-scope="scope">
                  <el-input-number
                    v-filter-input
                    v-model="dialogTable[scope.$index].basiss[index].basisQuantity"
                    clearable
                    size="small"
                    :precision="2"
                    :controls="false"
                  ></el-input-number>
                </template>
              </el-table-column>
              <el-table-column label="基准费用（元）" min-width="160" align="center">
                <template slot-scope="scope">
                  <el-input-number
                    v-filter-input
                    v-model="dialogTable[scope.$index].basiss[index].basisCost"
                    clearable
                    size="small"
                    :precision="2"
                    :controls="false"
                  ></el-input-number>
                </template>
              </el-table-column>
            </el-table-column>
          </el-table>
        </div>
        <div class="khzb-right" style="height: 350px">
          <div class="title-top u-df-st">
            <span class="red">*</span>
            关联区域
          </div>
          <el-tree
            ref="treeRef2"
            v-loading="loading2"
            :data="buildData ?? []"
            :props="defaultProps"
            :highlight-current="true"
            show-checkbox
            :check-strictly="true"
            :default-checked-keys="dialogForm?.area ?? []"
            @check="(nodeObj, SelectedObj) => currentChecked(nodeObj, SelectedObj, 2)"
            node-key="id"
            class="u-p20 mtree"
            default-expand-all
          >
            <span class="custom-tree-node u-fs14" slot-scope="{ node, data }">
              <!-- <ToolTip class="tree-lable u-pr20" :content="data.name" effect="dark" /> -->
              <span class="tree-lable u-pr20">{{ data.name }}</span>
            </span>
          </el-tree>
        </div>
      </div>
      <div class="u-ml20 u-mr20">
        <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="dialogForm.remark"></el-input>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="jzbgCancel" type="primary" plain>取 消</el-button>
        <el-button type="primary" size="small" @click="dialogSubmit">保 存</el-button>
      </div>
    </el-dialog>
    <el-dialog
      v-loading="loading3"
      :visible.sync="lsjzVisible"
      :append-to-body="true"
      :before-close="lsjzCancel"
      width="90%"
    >
      <div slot="title" class="dialog-title">
        <span class="tit u-prim-text">
          <span class="u-prim-text">历史基准</span>
          <span class="red u-fs14">
            *可查看历史变更基准记录，并可对当前基准及所有历史基准文件进行删除，删除后重新计算历史数据。
          </span>
        </span>
      </div>
      <div v-for="(item, index) in history?.rows ?? []">
        <div class="title-top u-df-spb u-prim-text u-mb20">
          <div>
            <span class="red">*</span>
            {{ item?.[0]?.basiss?.[0]?.isNewBasis == 0 ? '托管开始时间' : '变更时间：' }}
            <span class="u-primary">{{ item[0]?.year ?? '-' }}</span>
          </div>
          <div>
            <el-button
              class="u-ml5"
              size="small"
              type="primary"
              @click="downloadData2(item?.[0]?.basiss?.[0]?.projectCode, item?.[0]?.basiss?.[0]?.basisCode)"
              plain
            >
              下载数据
            </el-button>
            <!-- <el-button
              v-show="index === 0"
              class="u-ml5"
              size="small"
              type="primary"
              @click="lsjzDelete(item?.[0]?.basiss?.[0]?.basisCode)"
              plain
            >
              删除
            </el-button> -->
            <el-button size="small" type="primary" plain @click="showXgjl(item?.[0]?.basiss?.[0]?.basisCode)">
              修改记录
            </el-button>
          </div>
        </div>
        <HistoryBasis :data="item" :buildData="buildData" />
      </div>
      <pagination
        v-if="history?.total > 0"
        :total="history?.total ?? 0"
        :page.sync="pageObj.pageNum"
        :limit.sync="pageObj.pageSize"
        :pageSizes="[2, 5, 10]"
        @pagination="getList"
      />
    </el-dialog>
    <el-dialog
      v-loading="loading4"
      :visible.sync="lsxgjlVisible"
      title="基准修改记录"
      :append-to-body="true"
      :before-close="() => (lsxgjlVisible = false)"
      width="90%"
    >
      <div v-for="(item, index) in recordData?.rows ?? []" :key="index">
        <div class="title-top u-df-st u-prim-text u-mb20">
          <span class="red">*</span>
          {{ item?.[0]?.basiss?.[0]?.isNewBasis == 0 ? '托管开始时间' : '变更时间：' }}
          <span class="u-primary">{{ item[0]?.year ?? '-' }}</span>
        </div>
        <HistoryBasis :data="item" :buildData="buildData" />
      </div>
      <div class="u-df-spb">
        <el-button size="small" type="primary" @click="() => (lsxgjlVisible = false)">返回</el-button>
        <pagination
          v-if="recordData?.total > 0"
          :total="recordData?.total ?? 0"
          :page.sync="pageObj2.pageNum"
          :limit.sync="pageObj2.pageSize"
          :pageSizes="[2, 5, 10]"
          @pagination="getList2"
        />
      </div>
    </el-dialog>
  </div>
</template>
<style lang="scss" scoped>
.ad-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin: 20px;
  margin-top: 0;
  height: calc(100% - 240px);
  .title-top {
    width: 100%;
    padding-left: 20px;
    height: 48px;
  }
  .khzb-left {
    width: calc(60% + 22px);
    margin-right: 20px;
    height: 100%;
  }
  .khzb-right {
    width: calc(40% - 22px);

    height: 100%;
    overflow-y: scroll;
    .title-top {
      border-bottom: 1px solid #374468;
    }
  }
}
.app-dark {
  .khzb-left {
    .title-top {
      background: #242b41;
      border: 1px solid #374468;
      border-bottom: none;
    }
  }
  .khzb-right {
    border: 1px solid #374468;
    .title-top {
      background: #242b41;
      border-bottom: 1px solid #374468;
    }
  }
}
.app-light {
  .khzb-left {
    .title-top {
      background: #f5f7fa;
      border: 1px solid #eee;
      border-bottom: none;
    }
  }
  .khzb-right {
    border: 1px solid #eee;
    .title-top {
      background: #f5f7fa;
      border-bottom: 1px solid #eee;
    }
  }
}
.mtree {
  height: calc(100% - 48px);
  overflow-y: scroll;
}
.red {
  color: #ff0000;
}
.popButton {
  margin-left: 10px !important;
  margin-right: 10px !important;
}
</style>
